<%@ include file="/common/taglibs.jsp"%>

<head>
    <title><fmt:message key="tarjetapersonaform.title"/></title>
    <meta name="heading" content="<fmt:message key='tarjetapersonaform.heading'/>"/>
</head>

<spring:bind path="tarjetaPersona.*">
    <c:if test="${not empty status.errorMessages}">
    <div class="error">
        <c:forEach var="error" items="${status.errorMessages}">
            <img src="<c:url value="/images/iconWarning.gif"/>"
                alt="<fmt:message key="icon.warning"/>" class="icon"/>
            <c:out value="${error}" escapeXml="false"/><br />
        </c:forEach>
    </div>
    </c:if>
</spring:bind>

<form:form commandName="tarjetaPersona" method="post" action="tarjetapersonaform.html" 
	onsubmit="return onFormSubmit(this)" id="tarjetapersonaeditform">
<form:hidden path="id"/>
<form:hidden path="stTarjetaPersona"/>
		
<ul>
    <li class="buttonBar right">
        <%-- So the buttons can be used at the bottom of the form --%>
        <c:set var="buttons">
            <input type="submit" class="button" id="saveid" name="save" onclick="bCancel=false" value="<fmt:message key="button.save"/>"/>
            
		    <input type="button"  class="button"  onclick="location.href='<c:url value="/tarjetapersona/tarjetapersonalist.html"/>'"
		        value="<fmt:message key="button.cancel"/>"/>            
        </c:set>
        <c:out value="${buttons}" escapeXml="false"/>
    </li>
    
    <li>
		<label  class="required desc">
         <fmt:message key="common.codigo.tarjeta"/><span class="req">*</span>
        </label>
        <c:choose>
        <c:when test="${not empty tarjetaPersona.clpbClientePersona or not empty tarjetaPersona.id}">
        	<fmt:message>${tarjetaPersona.coCodigoTarjetaPersona}</fmt:message>
        	<form:hidden path="coCodigoTarjetaPersona" />
        </c:when>
        <c:otherwise>
	        <form:errors path="coCodigoTarjetaPersona" cssClass="fieldError"/>
	    	<form:input path="coCodigoTarjetaPersona" id="coCodigoTarjetaPersona" cssClass="text medium" cssErrorClass="text medium error" />
        </c:otherwise>
        </c:choose>
    </li>    
    
    <c:if test="${not empty tarjetaPersona.clpbClientePersona.id}">
	     <li>
	        <appfuse:label styleClass="desc" key="common.cliente.persona"/>
	        ${tarjetaPersona.clpbClientePersona}
	        <form:hidden path="clpbClientePersona.id" />
	    </li>  
	     <li>
	        <appfuse:label styleClass="desc" key="cliente.persona.codigo.tipo.documento"/>
	        ${tarjetaPersona.clpbClientePersona.clpbTipoDocumentoPersona.deTipoDocumentoPersona}
	    </li> 
	     <li>
	        <appfuse:label styleClass="desc" key="cliente.persona.codigo.documento"/>
	        ${tarjetaPersona.clpbClientePersona.coCodeNumeroDocumento}
	    </li>    
    </c:if>
    
    <li>
        <label  class="required desc">
         <fmt:message key="common.tipo.tarjeta"/><span class="req">*</span>
        </label>
        <c:choose>
        <c:when test="${not empty tarjetaPersona.clpbClientePersona}">
        	<fmt:message>${tarjetaPersona.clpdTipoTarjetaPersona.deTipoTarjetaPersona}</fmt:message>
        	<form:hidden path="clpdTipoTarjetaPersona.id"/>
        </c:when>
        <c:otherwise>
	        <form:errors path="clpdTipoTarjetaPersona.id" cssClass="fieldError"/>
	        <form:select cssClass="text medium" id="clpdTipoTarjetaPersona.id" path="clpdTipoTarjetaPersona.id" >
	        	<form:options itemValue="id" items="${tiposTarjetasPersonas}"/>
        </form:select>       
        </c:otherwise>
        </c:choose>
               
    </li>       
    
    <li>
        <label  class="required desc">
         <fmt:message key="common.estacion"/><span class="req">*</span>
        </label>
      	<c:choose>
        <c:when test="${not empty tarjetaPersona.clpbClientePersona}">
        	<fmt:message>${tarjetaPersona.clpbEstacion.deEstacion}</fmt:message>
        	<form:hidden path="clpbEstacion.id"/>
        </c:when>
        <c:otherwise>
	        <form:errors path="clpbEstacion.id" cssClass="fieldError"/>
	         <form:select cssClass="text medium" id="clpbEstacion.id" path="clpbEstacion.id">
	        	<form:options itemValue="id" itemLabel="deEstacion" items="${estaciones}"/>
	        </form:select>       
        </c:otherwise>
        </c:choose>
    </li>      

    <li>
        <label  class="required desc">
         <fmt:message key="common.vigencia.inicio"/><span class="req">*</span>
        </label>
        <c:choose>
        <c:when test="${not empty tarjetaPersona.clpbClientePersona}">
        	<fmt:message>${tarjetaPersona.desFechaInicio}</fmt:message>
        	<form:hidden path="desFechaInicio"/>
        </c:when>
        <c:otherwise>
        <form:input path="desFechaInicio" id="desFechaInicio" size="11"/>
        <input type="button" class="buttoncal" id="daFechaInicioVigenciaCal" value="..."/>  [<fmt:message key="date.format"/>]
        <form:errors path="desFechaInicio" cssClass="fieldError"/> 
		<script type="text/javascript">
	    	new Calendar({
	                  inputField: "desFechaInicio",		// id of the input field
	                  dateFormat: "%d/%m/%Y",
	                  trigger	: "daFechaInicioVigenciaCal",	// id of the button
	                  bottomBar	: false,
	                  onSelect	: function() {
                  		  this.hide();
	                  }
	          });
	     </script>  		            
        </c:otherwise>
        </c:choose>
        
    </li> 
         
    <li>
        <label  class="required desc">
         <fmt:message key="common.vigencia.fin"/><span class="req">*</span>
        </label>
         <c:choose>
        <c:when test="${not empty tarjetaPersona.clpbClientePersona}">
        	<fmt:message>${tarjetaPersona.desFechaFin}</fmt:message>
        	<form:hidden path="desFechaFin"/>
        </c:when>
        <c:otherwise>
        <form:input path="desFechaFin" id="desFechaFin" size="11"/>
        <input type="button" class="buttoncal" id="daFechaFinVigenciaCal" value="..."/>  [<fmt:message key="date.format"/>]
        <form:errors path="daFechaFinVigencia" cssClass="fieldError"/> 
		<script type="text/javascript">
	    	new Calendar({
	                  inputField: "desFechaFin",		// id of the input field
	                  dateFormat: "%d/%m/%Y",
	                  trigger	: "daFechaFinVigenciaCal",	// id of the button
	                  bottomBar	: false,
	                  onSelect	: function() {
	    				  this.hide();
                  		  //frk: si se quiere utilizar dejo esta linea de codigo
	                      //var date = Calendar.intToDate(this.selection.get());
	                  }
	          });
	     </script>              
        </c:otherwise>
        </c:choose>
        
        
    </li>          
         
    <li>
        <appfuse:label styleClass="desc" key="common.observaciones"/>
        <form:errors path="deObservaciones" cssClass="fieldError"/>
        <form:textarea path="deObservaciones" id="deObservaciones" cssClass="text medium" cssErrorClass="text medium error"/>
        <form:hidden path="stTarjetaPersona"/>
    </li>     
   
    <li class="buttonBar bottom">
        <c:out value="${buttons}" escapeXml="false"/>
    </li>
</ul>
</form:form>

<script type="text/javascript">
    Form.focusFirstElement($('tarjetapersonaeditform'));
    highlightFormElements();  
  
	function onFormSubmit(theForm) {

	  	var daFechaInicioVigencia = dwr.util.getValue("daFechaInicioVigencia");
	  	var daFechaFinVigencia = dwr.util.getValue("daFechaFinVigencia");
	  	return comparingDates(daFechaInicioVigencia , daFechaFinVigencia,
		  			 '<fmt:message key="common.vigencia.inicio"/>', '<fmt:message key="common.vigencia.fin"/>') 
			&& validateTarjetaPersonaEdit(theForm);
	}    


	 window.onload=function() {

		 var fechaIni=document.getElementById("desFechaInicio");
		 var fechaFin=document.getElementById("desFechaFin");
	    	if(${tarjetaPersona.clpbClientePersona.id}0!="0"){
	    		fechaIni.readOnly="true";
	    		fechaFin.readOnly="true";
		    	}

	    }

</script>
<v:javascript formName="tarjetaPersonaEdit" staticJavascript="false"/>
<script type="text/javascript" src="<c:url value="/scripts/validator.jsp"/>"></script>